<template>
	<tm-fullView>
		<tm-menubars :title="$t('首页')" iconColor="white" :showback="false">
			<view slot="right" style="padding-right: 20rpx;">
				<tm-menu :list="menus" direction="bottom" ment-direction="right" tip-direction="right" black @change="menusClick">
					<tm-icons color="#ffffff" size="32" name="icon-plus-circle"></tm-icons>
				</tm-menu>
			</view>
			<!-- <view slot="left" style="padding-left: 20rpx;">
				<tm-switch @change="switchDark" :text="['亮','暗']" v-model="dark"></tm-switch>
			</view> -->
		</tm-menubars>
		<tm-search placeholder="搜索好友/群聊" @focus="showRightSearch=true" @blur="showRightSearch=false" confirmText="取消" :showRight="showRightSearch"></tm-search>
		<view class="message-list">
			<tm-switchList v-for="user in users" :key="user.userId" color="blue"  rightLabel="09:24" rightIcon="icon-comment-dots" icon="icon-gem" :title="user.nickName" :label="user.text" :actions="item_0" :on='open'>
				<template #left>
					<view>
						<tm-avatar :round="8" :src="user.avatar" titl></tm-avatar>
					</view>
				</template>
			</tm-switchList>
		</view>
	</tm-fullView>
</template>

<script>
	import IndexApi,{getTranslates} from '@/api/index'
	import userData from '@/common/users.js'
	export default {
		data() {
			return {
				title: 'Hello',
				open:false,
				open_1:false,
				showRightSearch:false,
				item_0:[
					{text: "删除列表",width: 190,color: 'red'},
				],
				dark:false,
				users:[]
			}
		},
		computed:{
			menus(){
				return [
					{
						title:this.$t('发起群聊'),
						icon:'myicon-xiaoxi5',
						iconColor:'white'
					},
					{
						title:this.$t('添加好友'),
						icon:'myicon-tianjiahaoyou1',
						iconColor:'white'
					},
					{
						title:this.$t('扫一扫'),
						icon:'myicon-scan',
						iconColor:'white'
					}
				]
			}
		},
		async onLoad() {
			this.users=userData.users
			console.log("index onload")
			if(uni.getStorageSync('dark')){
				this.$tm.theme.setBlack(uni.getStorageSync('dark'));
				this.dark=uni.getStorageSync('dark')
			}
		},
		methods: {
			// switchDark(e){
			// 	console.log(e)
			// 	this.$tm.theme.setBlack(e.checked);
			// 	uni.setStorageSync("dark",e.checked)
			// }
			menusClick(e){
				console.log(e)
				if(e.index==1){
					this.navto("/friend/search")
				}
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
